<template>
  <van-button
    v-if="attitude !== 1"
    :loading="loading"
    icon="good-job-o"
    size="mini"
    style="border: none"
    @click="edit(true)"
  />
  <van-button
    v-else
    :loading="loading"
    icon="good-job"
    size="mini"
    style="border: none"
    @click="edit(false)"
  />
</template>

<script>
import { likeArticle, nolikeArticle } from '@/api/article.js'
export default {
  name: 'LikeIndex',
  props: {
    attitude: {
      type: [Number, String],
      required: true
    },
    artId: {
      type: [Number, String],
      required: true
    }
  },
  data () {
    return {
      loading: false
    }
  },
  methods: {
    async edit (boo) {
      this.loading = true
      if (boo) {
        // 文章点赞
        try {
          await likeArticle({
            target: this.artId
          })
          this.$toast('点赞成功')
          this.$emit('changeLike', 1)
        } catch (err) {
          console.log(err.response)
          this.$toast('点赞失败')
        }
      } else {
        // 取消文章点赞
        try {
          await nolikeArticle(this.artId)
          this.$toast('取消点赞成功')
          this.$emit('changeLike', -1)
        } catch (err) {
          this.$toast('取消点赞失败')
          console.log(err.response)
        }
      }
      this.loading = false
    }
  }
}
</script>

<style></style>
